<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>观察者模式</title>
</head>
<body>
<h6>观察者模式：一对多关系。通过Subject实例，收集所有的观察者，当Subject状态发生变化时，通知所有观察者。</h6>
<!--<script type="module" src="./observer1.js"></script>-->
<!--<script type="module" src="./observer2.js"></script>-->
<!--<script type="module">-->
<!--    import subject from "./subject.js";-->

<!--    subject.notify('dddddd')-->
<!--</script>-->

<!--<script>-->
<!--class Subject {-->
<!--    constructor() {-->
<!--        this.observers = []-->
<!--    }-->
<!--    add(observer) {-->
<!--        this.observers.push(observer)-->
<!--    }-->
<!--    remove(observer) {-->
<!--        this.observers = this.observers.filter(item => item !== observer)-->
<!--    }-->
<!--    notify(data) {-->
<!--        this.observers.forEach(observer => observer.update(data))-->
<!--    }-->
<!--}-->
<!--class Observer {-->
<!--    constructor(name) {-->
<!--        this.name = name-->
<!--    }-->
<!--    update(data) {-->
<!--        console.log(`${this.name}收到通知，数据为：${data}`)-->
<!--    }-->
<!--}-->
<!--let count = 10;-->
<!--const subject = new Subject()-->
<!--const observer1 = new Observer('observer1')-->
<!--const observer2 = new Observer('observer2')-->
<!--subject.add(observer1)-->
<!--subject.add(observer2)-->
<!--subject.notify(count)-->
<!--</script>-->
<!--<script>-->
<!--    let observers = {}-->
<!--    const proxy = new Proxy(observers, {-->
<!--        set(target, key, value, receiver) {-->
<!--            if (typeof value === 'function') {-->
<!--                return Reflect.set(target, key, value, receiver)-->
<!--            } else {-->
<!--                return false-->
<!--            }-->
<!--        }-->
<!--    })-->
<!--    proxy.observer1 = function (data) {-->
<!--        console.log(`observer1收到通知，数据为：${data}`);-->
<!--    }-->
<!--    proxy.observer2 = function (data) {-->
<!--        console.log(`observer1收到通知，数据为：${data}`);-->
<!--    }-->
<!--    proxy.observer3 = function (data) {-->
<!--        console.log(`observer1收到通知，数据为：${data}`);-->
<!--    }-->
<!--    for (let key in proxy) {-->
<!--        proxy[key]('22222222')-->
<!--    }-->
<!--</script>-->
s
</body>
</html>
